<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>演示：springboot2.0+freemarker+mybatis+druid实现支付宝，微信支付功能</title>
<style type="text/css">
body {
	font-family: arial;
}

table {
	border: 1px solid #ccc;
	width: 80%;
	margin: 0;
	padding: 0;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 0 auto;
}

table tr {
	border: 1px solid #ddd;
	padding: 5px;
}

table th, table td {
	padding: 10px;
	text-align: center;
}

table th {
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 1px;
	background-color:#50C2FF;
	color:#FFFFFF;
}

@media screen and (max-width: 600px) {
	table {
		border: 0;
	}
	table thead {
		display: none;
	}
	table tr {
		margin-bottom: 10px;
		display: block;
		border-bottom: 2px solid #ddd;
	}
	table td {
		display: block;
		text-align: right;
		font-size: 13px;
		border-bottom: 1px dotted #ccc;
	}
	table td:last-child {
		border-bottom: 0;
	}
	table td:before {
		content: attr(data-label);
		float: left;
		text-transform: uppercase;
		font-weight: bold;
	}
}

.note {
	max-width: 80%;
	margin: 0 auto;
}
</style>

</head>
<body>
	<div class="note">
		<h1>项目介绍：springboot2.0+freemarker+mybatis+druid实现支付宝，微信支付功能</h1>
		<p>springboot-weixin-ali-apy是基于springboot2.0+freemarker+mybatis+druid实现了支付宝，微信支付功能，扫码，表单提交支付，非常适合学习者，拿来就能用</p>
	</div>
	<table>
		<thead>
			<tr>
				<th>产品编号</th>
				<th>产品名称</th>
				<th>产品价格</th>
				<th>操作</th>
			</tr>
		</thead>
		<tbody>

			<#list pList as item>
			<tr>
				<td data-label="产品编号">${item.id }</td>
				<td data-label="日期">${item.name }</td>
				<td data-label="金额">￥${item.price }</td>
				<td data-label="周期"><a
					href="../alipay/goConfirm?productId=${item.id }">购买</a></td>
			</tr>
			</#list>
		</tbody>
	</table>

</body>
<script src="/static/js/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
	$(document).ready(function() {

		var hdnContextPath = $("#hdnContextPath").val();

	});
</script>
</html>